<%#-- copyright
OpenProject is a project management system.
Copyright (C) 2012-2017 the OpenProject Foundation (OPF)

This program is free software; you can redistribute it and/or
modify it under the terms of the GNU General Public License version 3.

OpenProject is a fork of ChiliProject, which is a fork of Redmine. The copyright follows:
Copyright (C) 2006-2017 Jean-Philippe Lang
Copyright (C) 2010-2013 the ChiliProject Team

This program is free software; you can redistribute it and/or
modify it under the terms of the GNU General Public License
as published by the Free Software Foundation; either version 2
of the License, or (at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with this program; if not, write to the Free Software
Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.

See doc/COPYRIGHT.rdoc for more details.

++#%>

<% form_attributes = @type.form_configuration_groups %>

<section class="form--section">
      <%= f.hidden_field :attribute_groups, value: @type.attribute_groups.to_json %>
      <%= f.hidden_field :attribute_visibility, value: @type.attribute_visibility.to_json %>
  <div id="types-form-configuration" op-drag-scroll ng-controller="TypesFormConfigurationCtrl" ng-init="upsaleLink = <%= '"' + OpenProject::Static::Links.links[:upsale][:href] +  '?utm_source=ce-form-configuration' + '"' %>">
    <div class="grid-block wrap">
      <div class="grid-content small-12 large-10">
      <p><%= t('text_form_configuration') %></p>

      <% if EnterpriseToken.show_banners? %>
        <div class="notification-box upsale-notification">
          <div class="notification-box--content">
            <h3><%= t('admin.enterprise.upgrade_to_ee') %></h3>
            <%= image_tag "enterprise_edition.png", class: "widget-box--teaser-image" %>

            <p><%= t('ee.upsale.form_configuration.description') %></p>

            <ul class="">
              <li>
                <%= t('ee.upsale.form_configuration.add_groups') %>
              </li>
              <li>
                <%= t('ee.upsale.form_configuration.rename_groups') %>
              </li>
            </ul>
            <p>
              <br/>
              <b><%= t('homescreen.blocks.upsale.become_hero') %></b> <%= t('homescreen.blocks.upsale.you_contribute') %>
            </p>
            <%= link_to( "#{OpenProject::Static::Links.links[:upsale][:href]}?utm_source=ce-form-configuration",
                  { class: 'button -alt-highlight',
                    aria: {label: t('admin.enterprise.order')},
                    title: t('admin.enterprise.order')}) do %>
              <i class="button--icon icon-add"></i>
              <span class="button--text"><%= t('admin.enterprise.order') %></span>
            <% end %>
          </div>
        </div>
      <% end %>

      <%= toolbar title: '' do %>
        <li class="toolbar-item">
          <button type="button" class="form-configuration--reset button" ng-click="resetToDefault($event)">
            <i class="button--icon icon-undo"></i>
            <span class="button--text"><%= t('types.edit.reset') %></span>
          </button>
        </li>
        <li class="toolbar-item">
          <% if EnterpriseToken.allows_to?(:edit_attribute_groups) %>
            <button type="button" class="form-configuration--add-group button -alt-highlight" ng-click="addGroup($event)">
              <i class="button--icon icon-add"></i>
              <span class="button--text"><%= t('types.edit.add_group') %></span>
            </button>
          <% else %>
            <button type="button" class="form-configuration--add-group button -alt-highlight" ng-click="showEEOnlyHint()">
              <i class="button--icon icon-add"></i>
              <span class="button--text"><%= t('types.edit.add_group') %></span>
            </button>
          <% end %>
        </li>
      <% end %>
      </div>
    </div>
    <div class="grid-block wrap">
      <div class="grid-content small-12 medium-6 large-5">
        <div id="type-form-conf-group-template" class="type-form-conf-group" data-original-key="" data-key="">
          <div class="group-head">
            <span class="group-handle icon-toggle"></span>
            <group-edit-in-place
              name=""
              key=""
              onvaluechange="groupNameChange"
              onupsale="<%= EnterpriseToken.allows_to?(:edit_attribute_groups) ? '' : 'showEEOnlyHint' %>"
              class="group-name">
            </group-edit-in-place>
            <span class="visibility-check"><%= t('label_always_visible') %></span>
            <span class="delete-group icon icon-close" ng-click="deleteGroup($event)"></span>
          </div>
          <div class="attributes" dragula='"attributes"'>
          </div>
        </div>
        <div id="draggable-groups" dragula='"groups"'>
          <% form_attributes[:actives].each do |group, attributes| %>
            <div class="type-form-conf-group" data-original-key="<%= group %>" data-key="<%= group %>">
              <div class="group-head">
                <span class="group-handle icon-toggle"></span>
                <group-edit-in-place
                  name="<%= group %>"
                  key="<%= group %>"
                  onvaluechange="groupNameChange"
                  onupsale="<%= EnterpriseToken.allows_to?(:edit_attribute_groups) ? '' : 'showEEOnlyHint' %>"
                  class="group-name">
                  <%= group %>
                </group-edit-in-place>
                <span class="visibility-check"><%= t('label_always_visible') %></span>
                <span class="delete-group icon icon-close" ng-click="deleteGroup($event)"></span>
              </div>
              <div class="attributes" dragula='"attributes"'>
                <% attributes.each do |attribute| %>
                  <div class="type-form-conf-attribute" data-key="<%= attribute[:key] %>">
                    <span class="attribute-handle icon-toggle"></span>
                    <span class="attribute-name">
                      <%= attribute[:translation] %>
                      <% if attribute[:is_cf] %>
                        <span class="attribute-cf-label"><%= CustomField.model_name.human %></span>
                      <% end %>
                    </span>
                    <div class="visibility-check">
                      <%= check_box_tag "",
                        'visible',
                        attribute[:always_visible],
                        title: t('tooltip.attribute_visibility.visible'),
                        'ng-click': "updateHiddenFields()" %>
                    </div>
                    <span class="delete-group icon icon-small icon-close" ng-click="deactivateAttribute($event)"></span>
                  </div>
                <% end %>
              </div>
            </div> <!-- END attribute group -->
          <% end %>
        </div>
      </div>
      <div class="grid-content small-12 medium-6 large-5">
        <div id="type-form-conf-inactive-group">
          <div class="group-head">
            <span class="group-name"><%= t(:label_inactive) %></span>
            <span class="advice">(Drag attributes from here to activate them)</span>
          </div>
          <div class="attributes" dragula='"attributes"'>
            <% form_attributes[:inactives].each do |inactive_attribute| %>
              <div class="type-form-conf-attribute" data-key="<%= inactive_attribute[:key] %>">
                <span class="attribute-handle icon-toggle"></span>
                <span class="attribute-name">
                  <%= inactive_attribute[:translation] %>
                  <% if inactive_attribute[:is_cf] %>
                    <span class="attribute-cf-label"><%= CustomField.model_name.human %></span>
                  <% end %>
                </span>

                <div class="visibility-check">
                  <%= check_box_tag "",
                                    'hidden',
                                    false,
                                    title: t('tooltip.attribute_visibility.visible'),
                                    'ng-click': "updateHiddenFields()" %>
                </div>
                <span class="delete-group icon icon-close" ng-click="deactivateAttribute($event)"></span>
              </div>
            <% end %>
          </div>
        </div><!-- END type form configurator -->
      </div>
    </div>
  </div>
</section>

<div class="grid-block">
  <div class="generic-table--action-buttons">
  <%= styled_button_tag t(@type.new_record? ? :button_create : :button_save),
      class: 'form-configuration--save -highlight -with-icon icon-checkmark' %>
  </div>
</div>
